<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <title>客户线索表</title>
    <script src="../../../static/kaige/js/szload.js"></script>
</head>
<body>
<div class="kaige-body">
    <table class="layui-table" id="pageTable" lay-filter="pageTable" lay-size="sm"></table>
    <input type="hidden" name="keywordsCache" value="{}"/>
</div>
<script>
    load_init_js([
        szoapcpath + '/static/kaige/js/date.js',
        szoapcpath + '/static/kaige/js/search.js',
        szoapcpath + '/static/kaige/js/xm-select.js'
    ], function () {
        layui.config({
            base: szoapcpath + '/static/kaige/layuiextend/'
        }).use(['element', 'table', 'form', 'layer', 'kaige', 'laydate', 'glfiles','laytpl'], function () {
            var element = layui.element
                , layer = layui.layer
                , table = layui.table
                , form = layui.form
                , kaige = layui.kaige
                , laydate = layui.laydate
                , glfiles = layui.glfiles
                , laytpl = layui.laytpl
                , $ = layui.$;
            form.render();

            window.kaige_page = {
                logout_url: '/index/logout',
                welcome: './pages/welcome.html',
                menus: [],
                leftmenu: [],
            };
            window.pagedict = parent.window.kaige_page.dict || {};


            kaige.table({
                elem: '#pageTable',
                url: "/crm.clue/index",
                id: 'pageTable',
                toolbar: '#dtoolbar',
                defaultToolbar: ['filter'],
                cols: [[
                    {field: 'id', title: '', align: 'center'},
                    {field: 'name', title: '线索名称', align: 'center', templet: '#name_click'},
                    {field: 'source', title: '线索来源', align: 'center', templet: '#source_name'},
                    {field: 'telephone', title: '电话', align: 'center'},
                    {field: 'mobile', title: '手机', align: 'center'},
                    {field: 'industry', title: '客户行业', align: 'center', templet: '#industry_name'},
                    {field: 'level', title: '客户级别', align: 'center', templet: '#level_name'},
                    {field: 'address_detail', title: '地址', align: 'center'},
                    {field: 'remarks', title: '备注', align: 'center'},
                    {field: 'next_time', title: '下次联系时间', align: 'center'},
                    {field: 'create_time', title: '创建时间', align: 'center'},
                    {title: '操作', toolbar: '#dtrbar', align: 'center', width: 150, fixed: 'right'}
                ]]
            });


            window.showPage = function (id) {
                kaige.form({
                    url: "/crm.clue/edit",
                    data: {id: id},
                    id: 'lvyb',
                    area: ['750px', '750px'],
                    title: '<i class="layui-icon layui-icon-add-circle"></i>基础-客户线索表',
                    tablelayid: 'contentTable',
                    overflow: false,
                    encode: 1,
                    callbefore: function (layero, index) {
                        laydate.render({
                            elem: '#next_time'
                            , type: 'datetime'
                        });
                        table.render({
                            elem: '#contentTable'
                            , url: "/crm.record/index"
                            , id: 'contentTable'
                            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                            , cols: [[
                                {field: 'follow_type_name', title: '跟进类型', align: 'center', width: 100},
                                {field: 'follow_time', title: '跟进时间', align: 'center'},
                                {field: 'follow_name', title: '跟进状态', align: 'center'},
                                {field: 'content', title: '跟进内容', align: 'center'},
                                {field: 'next_time', title: '下次跟进时间', align: 'center'},
                            ]]
                            , where: {
                                "relation_id": id,
                            }
                        });
                    },
                });
            }

            //列表-监听表头工具栏事件dtoolbar
            table.on('toolbar(pageTable)', function (obj) {
                switch (obj.event) {
                    case 'btn-add':
                        btnadd();
                        break;
                }
            });

            //列表-监听单元格行工具事件dtrbar
            table.on('tool(pageTable)', function (obj) {
                var that = this;
                var data = obj.data;
                switch (obj.event) {
                    case 'edit':
                        baredit(data);
                        break;
                    case 'recordAdd':
                        recordAdd(data);
                        break;
                }
            });

            window.show_employee = function () {
                laydate.render({
                    elem: '#next_time'
                    , type: 'date'
                });

                kaige.xmSelect({
                    id: 'relation_id',
                    url: '/select/ClueName',
                    udata: {automatch: 1},
                    radio: true,
                    clickClose: true
                });

                $('#reminds_name').on('focus', function () { //rece_id_name 要调用的文本框
                    layer.open({
                        title: '选择适用对象',
                        content: szoa.client.path + '/pages/pmm/config/ugdc.html',
                        area: ['690px', '470px'],
                        type: 2,
                        success: function (layero, index) {
                            window.ugdcinfo = function (opt) {
                                $('#reminds_name').val(opt.names);
                                $('#reminds_id').val(opt.ids); // 隐藏的文本框存 id ,部门id(u1,u4),组id(g1,g2),部门根ID（c1,c9)与部门ID区别 根ID需要查找同所有子部门
                                layer.close(layer.index);
                            }
                        }
                    });
                });
            }

            window.showRecord = function (id, name) {
                kaige.form({
                    url: "/crm.record/add",
                    data: {},
                    id: 'record',
                    area: ['750px', '450px'],
                    title: '<i class="layui-icon layui-icon-add-circle"></i> 添加 - 客户跟进记录',
                    tablelayid: 'pageTable',
                    overflow: false,
                    encode: 1,
                    callbefore: function (layero, index) {
                        $("#relation_id_name").val(name);
                        $("#relation_id").val(id);
                        show_employee();
                    },
                    postbefore: function (updata) {
                        updata.files_id = updata.form_files_id;
                        delete updata.form_files_id;
                        return updata;
                    },
                    getdata: function (res) {
                        var data = (res && res.data && res.data.fi) ? res.data.fi : null;
                        glfiles.form({
                            id: 'form',
                            is_edit: true,
                            data: data
                        });
                    }
                });
            }

            window.editInfo = function (id) {
                kaige.form({
                    url: "/crm.clue/edit",
                    data: {id: id},
                    id: 'kaige',
                    area: ['750px', '450px'],
                    title: '<i class="layui-icon layui-icon-edit"></i> 编辑 - 客户线索表',
                    tablelayid: 'pageTable',
                    overflow: false,
                    encode: 1,
                    callbefore: function (layero, index) {
                        laydate.render({
                            elem: '#next_time'
                            , type: 'datetime'
                        });
                    },
                });
            }

            window.delInfo = function (id) {
                layer.confirm('您确定删除吗？', {
                    title: '<i class="layui-icon layui-icon-delete"></i> 删除确认',
                    btn: ['确认', '取消']
                }, function () {
                    $.post("/crm.clue/goodsinfo", {id: id}, function (res) {
                        res.status && table.reload('pageTable');
                        layer.msg(res.msg);
                    });
                });
            }

            window.changeCustomer = function (id) {
                layer.confirm('您确定转为客户吗？', {
                    title: '<i class="layui-icon layui-icon-delete"></i> 转为客户确认',
                    btn: ['确认', '取消']
                }, function () {
                    $.post("/xzm.Goodspurchase/customer", {id: id}, function (res) {
                        res.status && table.reload('pageTable');
                        layer.msg(res.msg);
                    });
                });
            }

            function recordAdd(e) {
                var name = e.name;
                var id = e.id;
                showRecord(id, name);
            }

            window.showMap = function () {
                $.get("/crm.customer/show_address", {}, function (res) {
                    var content = $('#address_form_html').html();
                    laytpl(content).render(res.data, function (reshtml) {
                        layer.open({
                            id: 'address_form_box',
                            type: 1,
                            anim: 4,
                            area: ['400px', '100%'],
                            title: "地图",
                            offset: 'r',
                            content: reshtml,
                            btn: ['确定', '取消'],
                            yes: function (index, layero) {
                                layer.close(index);
                            },
                        })
                    })
                })
            }

            //添加
            function btnadd() {
                window.addEventListener('message', function (event) {
                    // 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
                    var loc = event.data;
                    if (loc && loc.module == 'locationPicker') {//防止其他应用也会向该页面post信息，需判断module是否为'locationPicker'
                        $("#address").val(loc.poiaddress);
                        $("#address_detail").val(loc.poiname);
                        // $("#lat").val(loc.latlng.lat);
                        // $("#lng").val(loc.latlng.lng);
                    }
                }, false);

                kaige.form({
                    url: "/crm.clue/add",
                    data: {},
                    id: 'kaige',
                    area: ['750px', '450px'],
                    title: '<i class="layui-icon layui-icon-add-circle"></i> 添加 - 客户线索表',
                    tablelayid: 'pageTable',
                    overflow: false,
                    encode: 1,
                    callbefore: function (layero, index) {
                        laydate.render({
                            elem: '#next_time'
                            , type: 'datetime'
                        });
                    }
                });
            }

            //编辑
            function baredit(d) {
                window.addEventListener('message', function (event) {
                    // 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
                    var loc = event.data;
                    if (loc && loc.module == 'locationPicker') {//防止其他应用也会向该页面post信息，需判断module是否为'locationPicker'
                        $("#address").val(loc.poiaddress);
                        $("#address_detail").val(loc.poiname);
                        // $("#lat").val(loc.latlng.lat);
                        // $("#lng").val(loc.latlng.lng);
                    }
                }, false);

                editInfo(d.id);
            }


        });
    });
</script>
<script type="text/html" id="dtrbar">
    <div class="layui-btn-group">
        <button class="layui-btn layui-btn-xs" lay-event="edit" title="编辑">
            编辑
        </button>
        <button class="layui-btn layui-btn-xs" lay-event="recordAdd" title="跟进">
            跟进
        </button>
    </div>
</script>
<script type="text/html" id="dtoolbar">
    <div class="layui-btn-container layui-form filter-form" lay-filter="searchform">
        <div class="layui-btn-group">
            <button type="button" class="layui-btn layui-btn-sm" lay-event="btn-add" style="margin-top:2px;"><i
                    class="layui-icon layui-icon-add-circle"></i> 添加
            </button>
        </div>
    </div>
</script>

<script type="text/html" id="name_click">
    <a href="javascript:void(0);" onclick="showPage({{ d.id }});">{{ d.name }}</a>
</script>

<script type="text/html" id="source_name">
    {{# for(var ipd in pagedict.clue_source){ }}
    {{# if(d.source ==ipd){ }}
    <span>{{ pagedict.clue_source[ipd] }}</span>
    {{# } }}
    {{# } }}
</script>

<script type="text/html" id="industry_name">
    {{# for(var ipd in pagedict.clue_industry){ }}
    {{# if(d.industry ==ipd){ }}
    <span>{{ pagedict.clue_industry[ipd] }}</span>
    {{# } }}
    {{# } }}
</script>


<script type="text/html" id="level_name">
    {{# for(var ipd in pagedict.clue_level){ }}
    {{# if(d.level ==ipd){ }}
    <span>{{ pagedict.clue_level[ipd] }}</span>
    {{# } }}
    {{# } }}
</script>

<!--线索编辑和添加页面-->
<script type="text/html" id="kaige_form_html">
    <form class="layui-form layui-form-pane kaige-body-form" style="padding: 5px;" lay-filter="kaige_form_lay_filter">
        {{# if(d.id){ }}
        <input type="hidden" name="id" value="{{ d.id }}"/>
        {{# } }}
        <div class="layui-form-item">
            <label class="layui-form-label">名称</label>
            <div class="layui-input-inline">
                <input name="name" value="{{ d.name || '' }}" class="layui-input" type="text" required
                       lay-verify="required">
            </div>
            <label class="layui-form-label">来源</label>
            <div class="layui-input-inline">
                <select name="source" lay-verify="required">
                    {{# lay.each(pagedict.clue_source,function(index,item){
                    if(index == ''){
                    top.layer.msg('系统字典->线索来源未配置完成，值不能为空');
                    }
                    }}
                    <option value="{{ index }}" {{ d.source== index ?
                    'selected' :'' }}>{{ item }}</option>
                    {{# }) }}
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">客户行业</label>
            <div class="layui-input-inline">
                <select name="industry" lay-verify="required">
                    {{# lay.each(pagedict.clue_industry,function(index,item){
                    if(index == ''){
                    top.layer.msg('系统字典->客户行业未配置完成，值不能为空');
                    }
                    }}
                    <option value="{{ index }}" {{ d.clue_industry== index ?
                    'selected' :'' }}>{{ item }}</option>
                    {{# }) }}
                </select>
            </div>
            <label class="layui-form-label">手机</label>
            <div class="layui-input-inline">
                <input name="mobile" value="{{ d.mobile || '' }}" class="layui-input" type="text" required
                       lay-verify="required"/>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">客户级别</label>
            <div class="layui-input-inline">
                <select name="level" lay-verify="required">
                    {{# lay.each(pagedict.clue_level,function(index,item){
                    if(index == ''){
                    top.layer.msg('系统字典->客户级别未配置完成，值不能为空');
                    }
                    }}
                    <option value="{{ index }}" {{ d.level== index ?
                    'selected' :'' }}>{{ item }}</option>
                    {{# }) }}
                </select>
            </div>

            <label class="layui-form-label">电话</label>
            <div class="layui-input-inline">
                <input name="telephone" value="{{ d.telephone || '' }}" class="layui-input" type="text" required
                       lay-verify="required">
            </div>

        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">地址</label>
            <div class="layui-input-block">
                <input id="address" name="address" value="{{ d.address || '' }}" class="layui-input" type="text"
                       onfocus="showMap();">
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">详细地址</label>
            <div class="layui-input-block">
                <input id="address_detail" name="address_detail" value="{{ d.address_detail || '' }}"
                       class="layui-input" type="text" onfocus="showMap();">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">下次时间</label>
            <div class="layui-input-inline">
                <input name="next_time" value="{{ d.next_time || '' }}" class="layui-input" type="text" id="next_time">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <input name="remarks" value="{{ d.remarks || '' }}" class="layui-input" type="text">
            </div>
        </div>

        <div class="layui-form-item layui-hide">
            <button class="layui-hide" lay-submit="" id="kaige_form_btn_save" lay-filter="kaige_form_btn_save">保存数据
            </button>
        </div>
    </form>
</script>

<script type="text/html" id="record_form_html">
    <form class="layui-form layui-form-pane kaige-body-form" style="padding: 5px;" lay-filter="record_form_lay_filter">
        <input type="hidden" id="relation_id" value="" name="relation_id"/>
        <input type="hidden" id="relation_id_name" value="" name="relation_name"/>
        <div class="layui-form-item">
            <label class="layui-form-label">跟进类型</label>
            <div class="layui-input-inline">
                <select name="follow_type" lay-verify="required">
                    {{# lay.each(pagedict.followType,function(index,item){
                    if(index == ''){
                    top.layer.msg('系统字典->跟进类型未配置完成，值不能为空');
                    }
                    }}
                    <option value="{{ index }}">{{ item }}</option>
                    {{# }) }}
                </select>
            </div>

            <label class="layui-form-label">下次跟进时间</label>
            <div class="layui-input-inline">
                <input id="next_time" name="next_time" value="" class="layui-input" type="text">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">跟进内容</label>
            <div class="layui-input-block">
                <input name="content" value="" class="layui-input" type="text">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">跟进状态</label>
            <div class="layui-input-inline">
                <select name="follow" lay-verify="required">
                    {{# lay.each(pagedict.followStatus,function(index,item){
                    if(index == ''){
                    top.layer.msg('系统字典->客户跟进状态未配置完成，值不能为空');
                    }
                    }}
                    <option value="{{ index }}">{{ item }}</option>
                    {{# }) }}
                </select>
            </div>
            <label class="layui-form-label">提醒人员列表</label>
            <div class="layui-input-inline">
                <input id="reminds_name" type="text" value="" name="reminds_name"
                       class="layui-input"/>
                <input id="reminds_id" type="hidden" value="" name="reminds_id"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item" id="form_files_gl_html"></div>
        <div class="layui-form-item layui-hide">
            <button class="layui-hide" lay-submit="" id="record_form_btn_save" lay-filter="record_form_btn_save">保存数据
            </button>
        </div>
    </form>
</script>

<script type="text/html" id="lvyb_form_html">
    <div class="layui-row" style="margin-top: 20px;">
        <div class="layui-col-sm8">
            <div style="margin:0px 40px;line-height: 27px;">
                <i class="layui-icon layui-icon-file-b"></i><span>{{ d.name }}</span>
            </div>
        </div>
        <div class="layui-col-sm4">
            <div class="layui-btn-group">
                <button class="layui-btn layui-btn-normal layui-btn-sm" onclick="editInfo('{{ d.id }}');">编辑</button>
                <!--                <button class="layui-btn layui-btn-normal layui-btn-sm">转移</button>-->
                <button class="layui-btn layui-btn-normal layui-btn-sm" type="button"

                        onclick="changeCustomer('{{ d.id }}');">转为客户
                </button>
                <button class="layui-btn layui-btn-normal layui-btn-sm" type="button" onclick="delInfo('{{ d.id }}');">
                    删除
                </button>
            </div>
        </div>
    </div>
    <div class="layui-row" style="margin-top: 20px;">
        <div class="layui-col-sm12">
            <table class="layui-table">
                <tr>
                    <td>线索名称</td>
                    <td>线索来源</td>
                    <td>手机号</td>
                    <td>下次跟进时间</td>
                    <td>更新时间</td>
                    <td>负责人</td>
                </tr>
                <tr>
                    <td>{{ d.name }}</td>
                    <td>{{ d.source_name }}</td>
                    <td>{{ d.mobile }}</td>
                    <td>{{ d.next_time }}</td>
                    <td>{{ d.update_time }}</td>
                    <td>{{ d.owner_user_name }}</td>
                </tr>
            </table>
        </div>
    </div>
    <div class="layui-row" style="margin-top: 20px;">
        <div class="layui-col-sm12">
            <div class="layui-tab layui-tab-card">
                <ul class="layui-tab-title">
                    <li class="layui-this">跟进记录</li>
                    <li>基础信息</li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <div class="layui-btn-group" style="margin:5px 0px 20px 20px;">
                            <button class="layui-btn layui-btn-normal layui-btn-sm" type="button"
                                    onclick="showRecord('{{ d.id }}','{{ d.name }}');">新建跟进
                            </button>
                        </div>
                        <table class="layui-hide" id="contentTable" lay-filter="contentTable" lay-size="sm"
                               style="width: 100%"></table>
                    </div>
                    <div class="layui-tab-item">
                        <div class="layui-card">
                            <div class="layui-card-header">基础信息</div>
                            <div class="layui-card-body">
                                <table style="width: 100%;">
                                    <tr>
                                        <td>线索名称:{{ d.name }}</td>
                                        <td>线索来源:{{ d.source_name }}</td>
                                    </tr>
                                    <tr>
                                        <td>客户行业:{{ d.industry_name }}</td>
                                        <td>手机号:{{ d.mobile }}</td>
                                    </tr>
                                    <tr>
                                        <td>客户级别:{{ d.level_name }}</td>
                                        <td>电话:{{ d.telephone }}</td>
                                    </tr>

                                    <tr>
                                        <td>地址:{{ d.address_detail }}</td>
                                        <td>下次联系时间:{{ d.next_time }}</td>
                                    </tr>
                                    <tr>
                                        <td>备注信息:{{ d.remarks }}</td>
                                        <td></td>
                                    </tr>
                                </table>
                            </div>
                        </div>


                    </div>
                </div>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="address_form_html">
    <input type="hidden" name="allclose" value="1"/>
    <div style="width: 100%;height: 500px">
        <iframe id="mapPage"
                src="https://apis.map.qq.com/tools/locpicker?search=1&type=1&key={{ d.set }}&referer=crm"
                width="100%" height="100%" frameborder="0">
        </iframe>
    </div>
</script>


</body>

</html>